<template>
  <div class="live-control">
    <el-card
      ><MainHeader
        placeholder="搜索直播间名称、主播名称、房间号等……"
        title="直播控制台"
      ></MainHeader>
    </el-card>
    <el-card style="margin: 10px 0">
      <div class="control-yugao">
        <div class="yugao-left">直播预告</div>
        <div class="yugao-right">本场直播无预告内容</div>
      </div>
    </el-card>
    <MenuActive :roomid="roomid"></MenuActive>
  </div>
</template>

<script lang="ts">
import { defineComponent, onMounted } from 'vue'
import { MainHeader } from '@/components/main-header/index'
import MenuActive from './cpns/el-menu-active.vue'
import { useRoute } from 'vue-router'
export default defineComponent({
  components: { MainHeader, MenuActive },
  setup() {
    // 获取直播间id
    const route = useRoute()
    let roomid = route.query.roomid
    onMounted(() => {
      console.log(route.query.roomid)
    })
    return { roomid }
  },
})
</script>

<style scoped lang="less">
.live-control {
  .control-yugao {
    display: flex;
    justify-content: space-between;

    .yugao-left {
      font-size: 0.25rem;
      font-weight: bold;
    }
    .yugao-right {
      font-size: 0.15rem;
      color: rgb(143, 138, 138);
    }
  }
}
</style>
